<title>排行榜</title>
<div id="ranking" style="padding-top: 2.6em;" ng-init="list=2">
	<div class="choose mui-clearfix">
		<div class="mui-content mainchoose mui-clearfix">
			<div class="mui-row mui-clearfix" style="position: fixed;top: 0px;width: 100%;z-index: 999;">
				<div class="mui-col-sm-6 mui-col-xs-6">

					<a ng-class="{active:list==1}" ng-click="list=1">
						综合榜

					</a>

				</div>
				<div class="mui-col-sm-6 mui-col-xs-6">

					<a ng-class="{active:list==2}" ng-click="list=2">
						胜率榜

					</a>

				</div>

			</div>
		</div>
		<div ng-if="list==1" class="page mui-clearfix">
			<div class="mui-row zhTitle mui-clearfix">
				<div class="mui-col-sm-12 mui-col-xs-12" ng-init="shop.xList=1">
					<div class="mui-row">
						<div class="mui-col-sm-3 mui-col-xs-3" ng-class="{active:shop.xList==1}" ng-click="shop.xList=1">
							跟单资金
							<hr />
						</div>
						<div class="mui-col-sm-3 mui-col-xs-3" ng-class="{active:shop.xList==2}" ng-click="shop.xList=2">
							跟单人数
							<hr />
						</div>
						<div class="mui-col-sm-3 mui-col-xs-3" ng-class="{active:shop.xList==3}" ng-click="shop.xList=3">
							交易手数
							<hr />
						</div>
						<div class="mui-col-sm-3 mui-col-xs-3" ng-class="{active:shop.xList==4}" ng-click="shop.xList=4">
							订单数量排行
							<hr />
						</div>

					</div>
				</div>
				<!--<div class="mui-col-sm-1 mui-col-xs-1">
                      <i class="mui-icon mui-icon-bars"></i>
				</div>-->
			</div>

			<div class="zhHead">

				<img src="img/RankingList_Headportrait1.png" class="goodHead" />
				<p>王欢乐</p>
				<div class="mask">
					<div class="inner">
						<img src="img/RankingList_icon1.png" /> 震八方 汇市无双
						<img src="img/RankingList_icon2.png" />

					</div>
				</div>
			</div>
			<div class="moneyPh" ng-if="shop.xList==1">
				<div class="inner">

					<div class="mui-row">
						<div class="mui-col-sm-7 mui-col-xs-7">
							<img src="img/ranking1.png" />
							<img src="img/RankingList_Headportrait1.png" />
							<span>王欢乐</span>
						</div>
						<div class="mui-col-sm-5 mui-col-xs-5">
							100,100.00
						</div>

					</div>
				</div>
				<div class="inner">

					<div class="mui-row">
						<div class="mui-col-sm-7 mui-col-xs-7">
							<img src="img/ranking2.png" />
							<img src="img/RankingList_Headportrait1.png" />
							<span>妮妮</span>
						</div>
						<div class="mui-col-sm-5 mui-col-xs-5">
							100
						</div>

					</div>
				</div>
			</div>
			<div class="moneyPh" ng-if="shop.xList==2">
				<div class="inner">

					<div class="mui-row">
						<div class="mui-col-sm-7 mui-col-xs-7">
							<img src="img/ranking1.png" />
							<img src="img/RankingList_Headportrait1.png" />
							<span>王hah</span>
						</div>
						<div class="mui-col-sm-5 mui-col-xs-5">
							100,100.00
						</div>

					</div>
				</div>
			</div>
			<div class="moneyPh" ng-if="shop.xList==3">
				<div class="inner">

					<div class="mui-row">
						<div class="mui-col-sm-7 mui-col-xs-7">
							<img src="img/ranking1.png" />
							<img src="img/RankingList_Headportrait1.png" />
							<span>王欢乐</span>
						</div>
						<div class="mui-col-sm-5 mui-col-xs-5">
							100,100.00
						</div>

					</div>
				</div>
			</div>
			<div class="moneyPh" ng-if="shop.xList==4">
				<div class="inner">

					<div class="mui-row">
						<div class="mui-col-sm-7 mui-col-xs-7">
							<img src="img/ranking1.png" />
							<img src="img/RankingList_Headportrait1.png" />
							<span>王ss</span>
						</div>
						<div class="mui-col-sm-5 mui-col-xs-5">
							100,100.00
						</div>

					</div>
				</div>
			</div>
		</div>
		<div ng-if="list==2" class="page">
			<div class="mui-row zhTitle mui-clearfix">
				<div class="mui-col-sm-11 mui-col-xs-11" id="scrollIn" ng-init="shop.xList=1">
					<div class="mui-row" style="position: relative;">
						<div class="mui-col-sm-3 mui-col-xs-3 getWin" ng-class="{active:shop.xList==1}" ng-click="changeRank_win(1)">

							<p>美瑞</p>
							<hr />
						</div>
						<div class="mui-col-sm-3 mui-col-xs-3 getWin" ng-class="{active:shop.xList==2}" ng-click="changeRank_win(2)">
							<p>美日</p>

							<hr />
						</div>
						<div class="mui-col-sm-3 mui-col-xs-3 getWin" ng-class="{active:shop.xList==3}" ng-click="changeRank_win(3)">
							<p>美加</p>

							<hr />
						</div>
						<div class="mui-col-sm-3 mui-col-xs-3 getWin" ng-class="{active:shop.xList==4}" ng-click="changeRank_win(4)">

							<p>欧美</p>

							<hr />
						</div>
						<div class="mui-col-sm-3 mui-col-xs-3 getWin" ng-class="{active:shop.xList==5}" ng-click="changeRank_win(5)">
							<p>镑美</p>
							<hr />
						</div>
						<div class="mui-col-sm-3 mui-col-xs-3 getWin " ng-class="{active:shop.xList==6}" ng-click="changeRank_win(6)">

							<p>澳美</p>

							<hr />
						</div>
						<div class="mui-col-sm-3 mui-col-xs-3 getWin" ng-class="{active:shop.xList==7}" ng-click="changeRank_win(7)">

							<p>纽美</p>
							<hr />
						</div>
						<div class="mui-col-sm-3 mui-col-xs-3 getWin" ng-class="{active:shop.xList==8}" ng-click="changeRank_win(8)">

							<p>黄金</p>
							<hr />
						</div>
						<div class="mui-col-sm-3 mui-col-xs-3 getWin" ng-class="{active:shop.xList==9}" ng-click="changeRank_win(9)">

							<p>白银</p>
							<hr />
						</div>
						<div class="mui-col-sm-3 mui-col-xs-3 getWin" ng-class="{active:shop.xList==10}" ng-click="changeRank_win(10)">

							<p>原油</p>
							<hr />
						</div>

					</div>
				</div>
				<div class="mui-col-sm-1 mui-col-xs-1 more" id="more">
					<i class="mui-icon mui-icon-bars"></i>
				</div>
			</div>
			<div class="zhHead">

				<img src="img/RankingList_Headportrait1.png" class="goodHead" />
				<p>王欢乐</p>
				<div class="mask">
					<div class="inner">
						<img src="img/RankingList_icon1.png" /> 震八方 汇市无双
						<img src="img/RankingList_icon2.png" />

					</div>
				</div>
			</div>
			<div id="screen" class="screen">
				<div class="title">
					筛选
				</div>
				<div class="mainInner">
					<div class="mui-row">
						<div class="mui-col-sm-4 mui-col-xs-4">
							<div class="box">

								<p>美瑞</p>
								<div class="triangle-bottomright">
									<img src="img/gou.png" />
								</div>
							</div>
						</div>
						<div class="mui-col-sm-4 mui-col-xs-4">
							<div class="box">

								<p>美日</p>
								<div class="triangle-bottomright">
									<img src="img/gou.png" />
								</div>
							</div>
						</div>
						<div class="mui-col-sm-4 mui-col-xs-4" style="margin-bottom: 1em;">
							<div class="box">

								<p>美加</p>
								<div class="triangle-bottomright">
									<img src="img/gou.png" />
								</div>

							</div>
						</div>

						<div class="mui-col-sm-4 mui-col-xs-4">
							<div class="box">

								<p>欧美</p>
								<div class="triangle-bottomright">
									<img src="img/gou.png" />
								</div>
							</div>
						</div>
						<div class="mui-col-sm-4 mui-col-xs-4">
							<div class="box">

								<p>镑美</p>

								<div class="triangle-bottomright">
									<img src="img/gou.png" />
								</div>
							</div>
						</div>
						<div class="mui-col-sm-4 mui-col-xs-4" style="margin-bottom: 1em;">
							<div class="box">

								<p>澳美</p>
								<div class="triangle-bottomright">
									<img src="img/gou.png" />
								</div>
							</div>
						</div>

						<div class="mui-col-sm-4 mui-col-xs-4">
							<div class="box">

								<p>纽美</p>
								<div class="triangle-bottomright">
									<img src="img/gou.png" />
								</div>
							</div>
						</div>
						<div class="mui-col-sm-4 mui-col-xs-4">
							<div class="box">
								<p>黄金</p>
								<div class="triangle-bottomright">
									<img src="img/gou.png" />
								</div>
							</div>
						</div>
						<div class="mui-col-sm-4 mui-col-xs-4" style="margin-bottom: 1em;">
							<div class="box">
								<p>白银</p>
								<div class="triangle-bottomright">
									<img src="img/gou.png" />
								</div>
							</div>
						</div>
						<div class="mui-col-sm-4 mui-col-xs-4">
							<div class="box">
								<p>原油</p>
								<div class="triangle-bottomright">
									<img src="img/gou.png" />
								</div>
							</div>
						</div>

					</div>
				</div>
				<div class="foot">
					<div class="mui-row">
						<div class="mui-col-sm-6 mui-col-xs-6">
							<button class="cz mui-btn" id="reset">重   置</button>

						</div>
						<div class="mui-col-sm-6 mui-col-xs-6">
							<button class="sure mui-btn" ng-click="rankSure()">确   定</button>

						</div>

					</div>

				</div>
			</div>
		</div>
	</div>
</div>
<div id="mask">

</div>
<script>
	//	$('.page').height($(window).height() - $('#onepage').height() - 100);
	var iWidth = $("#scrollIn .mui-col-sm-3").width() * 10 + 20 + "px";
	$("#scrollIn .mui-row").width(iWidth)
	$("#screen").height($(window).height())
	$("#mask").width($(window).width());
	$("#mask").height($(window).height());

	function changeAccount() {
		window.location.href = "#/addAccount"

	}
	//特效
	var time = 0;

	setInterval(function() {
			time++;
			if(time > 300) {
				time = -300
			}
			$(".mask .inner").css("right", time + "px");
		}, 10)
		//滑动

	$(function() {
		var i = 0;
		var oWidth;

		$("#scrollIn").on("swipeleft", function() {
			i++;
			if(i > 2) {
				i = 0;
			}
			oWidth = ($(window).width() - $(".more").width()) * i + "px";

			$("#scrollIn .mui-row").css("right", oWidth)

		});
		$("#scrollIn").on("swiperight", function() {
			i--;
			if(i < 0) {
				i = 0;
			}
			oWidth = ($(window).width() - $(".more").width()) * i + "px";
			$("#scrollIn .mui-row").css("right", oWidth)

		});
		var bol = true;
		$(".screen .box").on("tap", function() {

			if(bol) {

				$(this).addClass("active");
				$(this).children().show();

				bol = false;

			}

		});

		$("#reset").on("tap", function() {
			$(".screen .box").each(function() {
				$(this).removeClass("active");
				$(this).children(".triangle-bottomright").hide();
				bol = true;
			})
		})

		$("#more").on("tap", function() {
			$("#mask").show();
			$("#screen").show();
		
		})

	});

	layui.use('upload', function() {
		var upload = layui.upload;

		//执行实例
		var uploadInst = upload.render({
			elem: '#headBtn' //绑定元素
				,
			url: '/upload/' //上传接口

			,
			before: function(obj) { //obj参数包含的信息，跟 choose回调完全一致，可参见上文。
				obj.preview(function(index, file, result) {
					$('#headBtn img').attr('src', result); //图片链接（base64）
				});
			},
			done: function(res) {
				//上传完毕回调
			},
			error: function() {
				//请求异常回调
			}
		});
	});

	
</script>